<template>
    <view class="canEatDetail">
        <Navigation title="能吃什么" background="#fff" />
        <image class="w-f" src="../../static/logo.png" mode="widthFix"></image>
        <view class="fs-40 fw-600 mt-56 text-color4 f jc-c">{{ detail.foodName }}</view>
        <view class="f ai-c jc-c mt-12">
            <image src="http://cwht.ricecs.cn/app/index/error.png" class="w-24 h-24 mr-12" v-show="detail.catStatus == 2 || detail.dogStatus == 2"></image>
            <image src="http://cwht.ricecs.cn/app/index/warn.png" class="w-24 h-24 mr-12" v-show="detail.catStatus == 1 || detail.dogStatus == 1"></image>
            <image src="http://cwht.ricecs.cn/app/index/success.png" class="w-24 h-24 mr-12" v-show="detail.catStatus == 0 || detail.dogStatus == 0"></image>
            <view class="fs-24 text-color3">{{ type == 0 ? status[detail.catStatus] : status[detail.catStatus.dogStatus] }}</view>
        </view>
        <view class="ph-64 mt-33 fs-24 text-color3 text">
            {{ type == 0 ? detail.catRemark : detail.dogRemark }}
        </view>
        <view class="f ai-c jc-c mt-38">
            <view class="w-300 h-72 b-72 fs-28 fw-600 text-color f ai-c jc-c border-btn mr-16" @click="toBack">查看其他食物</view>
            <view class="w-300 h-72 b-72 f ai-c jc-c btn" @click='toDocotr'>
                <image src="http://cwht.ricecs.cn/app/index/ask.png" class="w-28 h-28 mr-12"></image>
                <view class="fs-28 fw-600 text-color5">咨询医生</view>
            </view>
        </view>
        <view class="f jc-c fs-24 text-color3 mt-88 pb-88">使用过程中如有任何建议或意见，<view class="text-color">欢迎反馈>></view></view>
    </view>
</template>
<script setup lang="ts">
import { ref } from 'vue';
import { onLoad } from '@dcloudio/uni-app';
import { foodDetail } from '@/services/api/index/index';
const detail = ref<any>('');
const type = ref(null);
const status = {
    0: '可以吃',
    1: '谨吃',
    2: '禁吃',
};
onLoad((options: any) => {
    //0: 猫 1:狗
    type.value = options.type;
    getDetail(options.id);
});
async function getDetail(id: string) {
    const { data } = await foodDetail({ id });
    detail.value = data;
}
function toBack() {
    uni.navigateBack();
}
 function toDocotr() {
    uni.navigateTo({
    	url:'/pages_index/doctor'
    })
}
</script>
<style lang="scss" scoped>
.canEatDetail {
    .text {
        min-height: 336rpx;
    }
    .border-btn {
        border: 2rpx solid #fabb3c;
    }
    .btn {
        background: #fabb3d;
    }
}
</style>
